<% content_for :toolbar do %>
  <%= render "toolbar", person: @person %>
<% end %>

<h1><%= @person.display_name %></h1>

<div class="row">
  <!-- TODO: Create a partial -->
  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">People</h4>
      </div>

      <div class="panel-body">
        <p class="pull-right text-muted"><%= @person.contacts_count %></p>
        <p><strong>In your circles</strong></p>

        <ul class="small-contact-list">
        <% @person.contacts.decorate.each do |contact| %>
          <li><%= contact.link_to_avatar %></li>
        <% end %>
        </ul>

        <br>

        <p class="pull-right text-muted"><%= @person.contact_of_count %></p>
        <p><strong>Have you in circles</strong></p>

        <ul class="small-contact-list">
        <% @person.contact_of.decorate.each do |person| %>
          <li><%= person.link_to_avatar %></li>
        <% end %>
        </ul>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <!-- TODO: Create a partial -->
  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Story</h4>
      </div>

      <div class="panel-body">
        <p>
          <strong>Tagline</strong>
          <br>
          <span class="text-muted"><%= @person.tagline %></span>
        </p>

        <p>
          <strong>Introduction</strong>
          <br>
          <span class="text-muted"><%= @person.introduction %></span>
        </p>

        <p>
          <strong>Bragging rights</strong>
          <br>
          <span class="text-muted"><%= @person.bragging_rights %></span>
        </p>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Groups</h4>
      </div>

      <div class="panel-body">
        <p>
          <span class="text-muted">Talk about stuff you're into with people who love it too.</span>
        </p>

        <ul class="small-contact-list">
        <!-- TODO: Create a partial -->
        <% @person.groups.decorate.each do |group| %>
          <li><%= link_to(group.display_name, group) %></li>
        <% end %>
        </ul>
        <br>

        <p>
          <a href="#" class="btn btn-primary">Discover groups</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Work</h4>
      </div>

      <div class="panel-body">
        <p>
          <strong>Occupation</strong>
          <br>
          <span class="text-muted"><%= @person.occupation %></span>
        </p>

        <p>
          <strong>Skills</strong>
          <br>
          <span class="text-muted"><%= @person.skills %></span>
        </p>

        <p>
          <strong>Employment</strong>
          <br>
          <span class="text-muted">
            <!-- TODO: Create a partial -->
            <!-- TODO: Need a decorator method -->
            <% if @person.employments.present? %>
              <ul class="list-unstyled">
              <% @person.employments.decorate.each do |employment| %>
                <li>
                  <span class="pull-right">
                    <%= link_to("Edit", edit_person_person_employment_path(@person, employment)) %>
                  </span>
                  <%= employment.formatted_employment %>
                </li>
              <% end %>
              </ul>
            <% else  %>
              Where have you worked?
            <% end  %>
          </span>
        </p>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Education</h4>
      </div>

      <div class="panel-body">
        <p>
          <span class="text-muted">
          <!-- TODO: Create a partial -->
          <!-- TODO: Need a decorator method -->
          <% if @person.educations.present? %>
            <ul class="list-unstyled">
            <% @person.educations.decorate.each do |education| %>
              <li>
                <span class="pull-right">
                  <%= link_to("Edit", edit_person_person_education_path(@person, education)) %>
                </span>
                <%= education.formatted_education %>
              </li>
            <% end %>
            </ul>
          <% else  %>
            Where have you gone to school?
          <% end  %>
          </span>
        </p>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Places</h4>
      </div>

      <div class="panel-body">
        <p>
          TODO: Add a map for the current location
        </p>

        <ul class="list-unstyled">
        <!-- TODO: Create a partial -->
          <li>
            <p>
              <strong>Currently</strong>
            </p>
            <!-- TODO: Need a decorator/model/view model(cells?) method-->
            <span class="pull-right">
              <%= link_to("Edit", edit_person_person_place_path(@person, @person.places.current)) %>
            </span>
            <p><%= @person.places.current.first.try(:city_name) %></p>
          </li>
          <li>
            <p>
              <strong>Previously</strong>
            </p>
            <!-- TODO: Need a decorator/model/view model(cells?) method-->
            <p><%= @person.places.previous.pluck(:city_name).join(" ,") %></p>
          </li>
        </ul>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Basic Information</h4>
      </div>

      <div class="panel-body">
        <div class="row">
          <div class="col-sm-6">
            <strong>Gender</strong>
          </div>

          <div class="col-sm-6">
            <%= @person.gender %>
          </div>
        </div>
        <br>

        <div class="row">
          <div class="col-sm-6">
            <strong>Looking for</strong>
          </div>

          <div class="col-sm-6">
            <span class="text-muted">
              <%= @person.looking_for %>
            </span>
          </div>
        </div>
        <br>

        <div class="row">
          <div class="col-sm-6">
            <strong>Birthday</strong>
          </div>

          <div class="col-sm-6">
            <%= @person.birthdate %>
          </div>
        </div>
        <br>

        <div class="row">
          <div class="col-sm-6">
            <strong>Relationship</strong>
          </div>

          <div class="col-sm-6">
            <span class="text-muted">
              <%= @person.relationship %>
            </span>
          </div>
        </div>
        <br>

        <div class="row">
          <div class="col-sm-6">
            <strong>Other names</strong>
          </div>

          <div class="col-sm-6">
            <span class="text-muted">
              <%= @person.other_names %>
            </span>
          </div>
        </div>
        <br>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Contact Information</h4>
      </div>

      <div class="panel-body">

        <div class="row">
          <div class="col-sm-4">
            <strong>Email</strong>
          </div>

          <div class="col-sm-8">
            <%= @person.email %>
          </div>
        </div>
        <br>

        <p>
          <strong>Addresses</strong>
        </p>

        <ul class="list-unstyled">
        <!-- TODO: Create a partial -->
        <% @person.addresses.decorate.each do |address| %>
          <!-- TODO: Need some space between <li> elements -->
          <li>
            <span class="pull-right">
              <%= link_to("Edit", edit_person_person_address_path(@person, address)) %>
            </span>
            <%= address.formatted_address %>
          </li>
        <% end %>
        </ul>

        <p>
          <strong>Phones</strong>
        </p>

        <ul class="list-unstyled">
        <!-- TODO: Create a partial -->
        <% @person.phones.each do |phone| %>
          <li>
            <span class="pull-right">
              <%= link_to("Edit", edit_person_person_phone_path(@person, phone)) %>
            </span>
            <%= phone.label_and_number %>
          </li>
        <% end %>
        </ul>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>

  <div class="col-sm-6">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">Links</h4>
      </div>

      <div class="panel-body">
        <p>
          <strong>Other profiles</strong>
        </p>

        <!-- TODO: Need a decorator method -->
        <% if @person.profiles.present? %>
          <ul class="list-unstyled">
          <!-- TODO: Create a partial -->
          <% @person.profiles.each do |profile| %>
            <li>
              <span class="pull-right">
                <%= link_to("Edit", edit_person_person_profile_path(@person, @person.profile)) %>
              </span>
              <%= link_to(profile.label, profile.url) %>
            </li>
          <% end %>
          </ul>
        <% else %>
          <p>
            <span class="text-muted">What pages are about you?</span>
          </p>
        <% end %>

        <p>
          <strong>Contributor to</strong>
        </p>

        <!-- TODO: Need a decorator method -->
        <% if @person.contributions.present? %>
          <ul class="list-unstyled">
          <!-- TODO: Create a partial -->
          <% @person.contributions.each do |contribution| %>
            <li>
              <span class="pull-right">
                <%= link_to("Edit", edit_person_person_contribution_path(@person, contribution)) %>
              </span>
              <%= link_to(contribution.display_name, contribution.url) %>
            </li>
          <% end %>
          </ul>
        <% else %>
          <p>
            <span class="text-muted">What pages feature your work?</span>
          </p>
        <% end %>

        <p>
          <strong>Links</strong>
        </p>

        <!-- TODO: Need a decorator method -->
        <% if @person.links.present? %>
          <ul class="list-unstyled">
          <!-- TODO: Create a partial -->
          <% @person.links.each do |link| %>
            <li>
              <span class="pull-right">
                <%= link_to("Edit", edit_person_person_link_path(@person, link)) %>
              </span>
              <%= link_to(link.label, link.url) %>
            </li>
          <% end %>
          </ul>
        <% else %>
          <p>
            <span class="text-muted">What pages interest you?</span>
          </p>
        <% end %>

        <p>
          <a href="#">Edit</a>
        </p>
      </div>
    </div>
  </div>
</div>
